<template>
	<view class="">
		<view class="c-card">
			<view class="cu-form-group ">
				<view class="title">车牌号</view>
				<picker @change="bindPickerChange" class="cuspicker"
				 range-key="LicensePlateNO" :value="ch_index" :range="car_list"
				 data-type="car">
					<view class="picker cuspicker_item">
						{{ch_index.car ? car_list[ch_index.car].LicensePlateNO : carInfo.LicensePlateNO  || '请选择车牌号'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="c-card">
			<view class="cu-form-group" v-for="(item,index) in asnNoList" :key="index">
				<view class="title">单号</view>
				<input type="text" @input="input" :value="item.value" :name="item[field]"
				 placeholder="输入/扫描ASN单号" :data-index="index"
				 :data-value="item.value" :data-field="item.field"></input>
				<text @click="scan(index)" class='lg text-gray cuIcon-scan'></text>
				<text @click="del" :data-index="index"
				 v-if="index !== 0" class="margin-left-sm lg text-red cuIcon-delete"></text>
			</view>
		</view>
		<view class="text-right padding">
			<button class="cu-btn line-blue"
			 @click="add"
			 style="border-radius: 15px;">新增单号</button>
		</view>

		<view class="padding flex flex-direction" style="margin-top: 30px;">
			<button class="cu-btn bg-blue lg" @click="bindCar">绑定发车</button>
		</view>
	</view>
</template>

<script>
	import mInput from '@/components/m-input.vue';
	import {
		showModal
	} from "@/utils/util.js"
	import {checklocation,getLocation} from '@/utils/common.js';
	export default {
		components: {
			mInput,
		},
		data() {
			return {
				carNo: '',
				asnNoList: [ {
					//field: 'asnNo0',
					field:0,
					value: '' 
				} ],
				car_list: [{
					LicensePlateNO: ''
				}],
				carInfo: {
					LicensePlateNO: '',
					id: ''
				},
				ch_index: {
					car: 0
				},
				OpenID: '',
				session: {},
				authSetting:{},
				subscriptionsSetting:{},
			}
		},
		mounted() {
			uni.showLoading({
			    title: '加载中'
			});
			this.session = uni.getStorageSync('session') || {};
			this.$store.dispatch('uni/GetTruckList', {
					openid: this.session.openid
				})
				.then(res => {
					uni.setStorage({
						key: 'truckList',
						data: res.data,
						success: () => {}
					})
					this.car_list = res.Data || [];
					uni.hideLoading()
				}).catch(()=>{
					uni.hideLoading()
				})
		},
		
		methods: {
		
			 add() {
				const index = this.asnNoList.length + 1;
				this.asnNoList.push({
					field:index,
					value: ''
				});
			}, 
			del(e) {
				const {
					index
				} = e.currentTarget.dataset;
				this.asnNoList.splice(index, 1);
			},
			input(e) {
				const {
					index
				} = e.currentTarget.dataset;
				this.asnNoList[index].value = e.target.value;
			},
			scan(index) {
				console.log('res', this.asnNoList)
				
				wx.scanCode({
					success: res => {
						
						 this.asnNoList[index].value=res.result
							
						
						
					}
				});
			},
			//打开设置
			openConfirm(message) {
					wx.showModal({
							content: message,
							confirmText: "确认",
							cancelText: "取消",
							success: (res) => {
									//点击“确认”时打开设置页面
									if (res.confirm) {
											wx.openSetting({
													success: (res) => {
															console.log(res.authSetting)
													},
													fail: (error) => {
															console.log(error)
													}
											})
									} else {
											console.log('用户点击取消')
									}
							}
					});
			},
			
			bindCar() {
				wx.getSetting({
					withSubscriptions:true,
					success:res=>{
						this.authSetting=res.authSetting
						this.subscriptionsSetting=res.subscriptionsSetting
						
						 if (res.subscriptionsSetting && res.subscriptionsSetting.itemSettings &&
						     res.subscriptionsSetting.itemSettings[message] == "reject"){
											//打开设置去设置
										this.openConfirm('检测到您没打开推送权限，是否去设置打开？')
									}else {
											wx.requestSubscribeMessage({
													tmplIds: [
														// '86ZneUjpXFGxUUOB_BAoUr8hGduUx_s-woMHmH1FIZI',
													'lbgBZo6G8TZy_IEDbh2xxVoj2XT-Df6v6TzEFgWxY4k',
													'5M6AU-WQDSvz4mWrSA846zXgj8mTMVBcgeGDk874g2A'
													],
													success: (res)=> {
														console.log('success',res)
														uni.showToast({
															title:'订阅成功',
															duration:2000,
														})
															/* if (res[message] == 'accept'){
																	//用户允许
															} */
													},
													fail: (res)=> { console.info(res) },
											})
									}
						
						
					}
				})
				
				const checked = this.checkData(this.asnNoList);
				const nArr = this.asnNoList.filter(v=>v.value)
				.map(item => {
					return {
						'InboundOrderNO': item.value
					}
				})
				const newArr = this.asnNoList.map(item => {
					return item.value
				})
				if (this.carInfo.LicensePlateNO && checked) {
					//重新绑定发车就重新获取位置，并设置定时器
					/* const _props = {store:this.$store,openid:this.session.openid};
					checklocation(_props);
					const timer = setInterval(() => {
						getLocation(_props);
					}, 10000);
					this.defined.setTimer(timer); */

					this.$store.dispatch('uni/CreateTruckTransport', {
						OpenID: this.session.openid,
						LicensePlateNO: this.carInfo.LicensePlateNO,
						DetailList: nArr,
					}).then((res) => {
						const {
							Code,
							Data,
							Message
						} = res;
						if (Code === 0 && Data) {
							uni.showModal({
								title: '已经生成车辆货物绑定单号：',
								content: Data,
								success: (res) => {
									uni.navigateBack({
										delta: 1
									})
								}
							})
						} else {
							uni.showModal({
								title: '提示：',
								content: Message,
							})
						}
					})
				} else {
					showModal({
						title: '提示',
						content: '请先填写信息，再绑定'
					})
				}
			},
			checkData(data) {
				let flag = false;
				data && data.length > 0 && data.forEach(v => {
					if (v.value) flag = true;
					return;
				})
				return flag
			},
			bindPickerChange(e) {
				const {
					type
				} = e.currentTarget.dataset;
				this.ch_index[type] = e.detail.value;
				this.carInfo.LicensePlateNO = this.car_list[e.detail.value].LicensePlateNO;
				this.carInfo.id = this.car_list[e.detail.value].id;
			},
		}
	}
</script>

<style lang="scss" scoped>
	.cu-form-group {
		padding: 0;
	}

	.add-img {
		width: 30px;
		height: 30px;
	}

	.c-card {
		padding: 15px;
		border-radius: 15px;
		background-color: #fff;
		margin: 15px 15px 0;
	}

	.cu-form-group picker .picker {
		text-align: left;
	}
</style>
